<extend name="admin/main"/>

<block name="title">
    <title>产品分类列表</title>
</block>

<block name="css"></block>

<block name="heading">产品分类列表</block>

<block name="content">
    <div class="row" data-widget-group="group">
        <div class="col-md-12">
            <div class="panel panel-default" data-widget='{"id" : "roles"}' style="visibility: visible">
                <div class="panel-heading">
                    <div class="panel-ctrls button-icon"
                         data-actions-container=""
                         data-action-collapse='{"target": ".panel-body"}'
                         data-action-expand=''
                         data-action-colorpicker=''
                         data-action-close=''
                    >
                    </div>
                    <h2>Product Categories</h2>
                </div>
                <div class="panel-editbox" data-widget-controls=""></div>
                <div class="panel-body">
                    <table class="table m-n table-hover table-bordered text-center">
                        <thead>
                        <tr>
                            <th class="text-center text-uppercase">#</th>
                            <th class="text-center text-uppercase">title</th>
                            <th class="text-center text-uppercase">updated_at</th>
                            <th class="text-center text-uppercase">created_at</th>
                            <th class="text-center text-uppercase">Action</th>
                        </tr>
                        </thead>
                        <tbody id="product_category_tbody">
                        <foreach name="categories" item="category">
                            <tr data-id="{$category.id}">
                                <td>{$category.id}</td>
                                <td><input type="text" class="form-control" value="{$category.title}"></td>
                                <td>{$category.updated_at}</td>
                                <td>{$category.created_at}</td>
                                <td>
                                    <div class="btn-group">
                                        <button class="btn btn-warning-alt btn-sm delete"><i class="fa fa-trash"></i></button>
                                    </div>
                                </td>
                            </tr>
                        </foreach>
                        </tbody>
                        <tfoot>
                        <tr>
                            <td colspan="5" class="text-left">
                                <form method="post" action="/admin/product/category/insert">
                                    <div class="form-group" style="margin-bottom: 0">
                                        <label for="title" class="pull-left" style="line-height: 30px">标题</label>
                                        <div class="col-xs-4">
                                            <input type="text" class="form-control" name="title" id="title" required>
                                        </div>
                                        <input type="submit" class="btn btn-success-alt" value="添加">
                                    </div>
                                </form>
                            </td>
                        </tr>
                        </tfoot>
                    </table>
                </div>
            </div>
        </div>
    </div>
</block>

<block name="js">
    <script type="text/javascript" src="__PUBLIC__/assets/demo/demo.js"></script>
    <script type="text/javascript" src="__PUBLIC__/assets/demo/demo-switcher.js"></script>
    <script type="text/javascript" src="__PUBLIC__/assets/plugins/bootbox/bootbox.js"></script>
    <script>
        $(document).ready(function () {
            $('#product_category_tbody').delegate('input', 'blur', function (e) {
                var el = $(this);
                var id = el.parents('tr').attr('data-id');
                var origin = el.attr('value');
                if (origin === el.val()) return;
                $.post('/admin/product/category/update', {id: id, title: el.val()}, function (res) {
                    var data = JSON.parse(res);
                    if (data.success === false) {
                        new PNotify({
                            title: 'Oh On!',
                            text: JSON.stringify(data.data),
                            type: 'error',
                            icon: 'ti ti-info-alt',
                            styling: 'fontawesome'
                        });
                    } else {
                        new PNotify({
                            title: 'success',
                            text: data.data,
                            type: 'success',
                            icon: 'ti ti-check',
                            styling: 'fontawesome'
                        });
                    }
                })
            });
            $('.delete').click(function () {
                var id = $(this).parents('tr').attr('data-id');
                bootbox.confirm('是否删除?', function (res) {
                    if (res === false) return;
                    $.post('/admin/product/category/delete', {id: id}, function (res) {
                        var data = JSON.parse(res);
                        if (data.success === false) {
                            new PNotify({
                                title: 'Oh On!',
                                text: JSON.stringify(data.data),
                                type: 'error',
                                icon: 'ti ti-info-alt',
                                styling: 'fontawesome'
                            });
                        } else {
                            window.location.reload();
                        }
                    });
                })
            })
        });
    </script>
</block>
